<template>
  <div class="body">
    <section class="review-banner">
      <div class="index-bannerMain clearfix center-block">
        <div class="index-title pull-left">
          <h2>评审公示</h2>
        </div>
      </div>
    </section>
    <section class="organ_screen">
      <div class="center-block">
        <h3 class="circular-title">公示列表</h3>
        <div class="MainTable" id="reviewList">
          <table class="table m_c_table" width="100%">
            <el-table :data="tableList" style="width: 100%">
              <el-table-column type="index" label="序号" width="100"></el-table-column>
              <el-table-column prop="itemName" label="项目名称"></el-table-column>
              <el-table-column prop="articleAuthor" label="事项名称"></el-table-column>
              <el-table-column prop="itemName" label="评审发起人"></el-table-column>
              <el-table-column prop="articleAuthor" label="评审模式"></el-table-column>
              <el-table-column
                align="right"
                :formatter="dateForma"
                prop="articleAddDate"
                label="发布时间"
              ></el-table-column>
            </el-table>
          </table>
          <!-- 分页区域 -->
          <div style="padding: 20px 0">
            <div class="fenYe clearfix">
              <el-pagination
                @size-change="handleSizeChange"
                @current-change="handleCurrentChange"
                :current-page="tableQuery.page"
                :page-sizes="[10, 15, 20, 25]"
                :page-size="tableQuery.pageSize"
                layout="total, sizes, prev, pager, next, jumper"
                :total="total"
              ></el-pagination>
            </div>
          </div>
        </div>
      </div>
    </section>
  </div>
</template>

<script>
// 获取表格数据
import { getTableList } from "@/api/projectApproval/index.js";
// moment 转换时间格式的插件
import moment from "moment";

export default {
  name: "reviewList",
  data: function() {
    return {
      tableList: [],
      tableQuery: {
        page: 1,
        pageSize: 2
      },
      total: 0
    };
  },
  methods: {
    // 获得表格数据
    getTableList() {
      getTableList().then(res => {
        // console.log(res);
        this.tableList = res.obj.rows;
        this.total = res.obj.total;
      });
    },
    // 分页中右边点击事件
    handleSizeChange(newSize) {
      this.tableQuery.page = newSize;
      this.getTableList();
      // console.log( this.tableQuery.page);
    },
    // 左边栏第几页的数据
    handleCurrentChange(newPage) {
      // this.tableQuery.pageSize=newPage
      // this.getTableList();
    },
    // 时间转化函数
    dateForma: function(row, column) {
      var date = row[column.property];
      if (date == undefined) {
        return "";
      }
      return moment(date).format("YYYY-MM-DD");
    }
  },
  created() {
    this.getTableList();
  }
};
</script>

<style scoped>
@import "../../../assets/css/agency.css";
</style>
